<template>
  <view class="uv-page" style="background-color: #fff;">
    <view class="uv-demo-block">
      <view class="uv-demo-block__content">
        <uv-form :model="form" :rules="rules" ref="form1" labelWidth="auto">
          <uv-form-item prop="time" label="日期:" borderBottom>
            <uv-input disabled v-model="form.time" border="none" placeholder="请输入日期"></uv-input>
          </uv-form-item>
          <uv-form-item prop="userName" label="姓名:" borderBottom>
            <uv-input disabled v-model="form.userName" border="none" placeholder="请填写姓名"></uv-input>
          </uv-form-item>
          <uv-form-item prop="type" label="考勤类型:" borderBottom>
            <uv-radio-group v-model="form.type">
              <view v-for="item in answerData">
                <uv-radio :name="item.dictKey" :label="item.dictValue" :key="item.dictKey"></uv-radio>
              </view>
            </uv-radio-group>
          </uv-form-item>
          <uv-form-item prop="remark" label="备注:" borderBottom>
            <uv-textarea v-model="form.remark" placeholder="请输入备注"></uv-textarea>
          </uv-form-item>
          <uv-form-item prop="updateTime" label="修改时间:" borderBottom>
            <uv-input disabled v-model="form.updateTime" border="none" placeholder="请填写修改时间"></uv-input>
          </uv-form-item>
          <uv-form-item prop="restDays" label="余休天数:" borderBottom>
            <uv-input disabled v-model="form.restDays" border="none" placeholder="请填写余休天数"></uv-input>
          </uv-form-item>
        </uv-form>

        <uv-button type="primary" v-if="editFlag" text="提交" customStyle="margin-top: 10px"
                   @click="submit"></uv-button>
        <view>
        </view>
      </view>
    </view>
  </view>
</template>
<script>

import UserSalaryDayAPI from '@/api/usersalaryday'
import {isToday} from "@/utils/media";
import DictAPI from "@/api/dict";

export default {
  data() {
    return {
      answerData: [],
      id: '',
      form: {},
      rules: {},
      editFlag: true //默认允许编辑提交
    }
  },
  onShow() {
    this.getAnswerToType()
  },
  onLoad(e) {
    this.id = e.id
    if (this.id) {
      this.detail(this.id)
    }
  },
  onReady() {
    // 如果需要兼容微信小程序，并且校验规则中含有方法等，只能通过setRules方法设置规则
    this.$refs.form1.setRules(this.rules)
  },
  methods: {
    getAnswerToType() {
      DictAPI.dictByCodeList({
        code: 'attendance_type'
      }).then(res => {
        this.answerData = res.data
      })
    },
    detail() {
      UserSalaryDayAPI.detail({
        id: this.id
      }).then(res => {
        console.log(res.data);
        this.form = res.data
        // 判断是否可以编辑 如果是今天，可以编辑
        this.editFlag = isToday(this.form.createTime)
      })
    },
    // 提交
    submit() {
      // 如果有错误，会在catch中返回报错信息数组，校验通过则在then中返回true
      this.$refs.form1.validate().then(res => {
        UserSalaryDayAPI.submit(this.form).then(res => {
          if (res.code === 200) {
            uni.showToast({
              icon: 'success',
              title: '提交成功'
            })
          }
          // 返回点到列表
          uni.reLaunch({
            url: '/subpackage/attendance/attendance'
          })
        })
      }).catch(errors => {
        uni.showToast({
          icon: 'error',
          title: '校验失败'
        })
      })
    },

  }
}
</script>
<style lang="scss" scoped>
.uv-page {
  padding: 15px 15px 40px 15px;
}

.uv-demo-block {
  margin-bottom: 22px;
}

.uv-demo-block__title {
  font-size: 14px;
  color: #8f9ca2;
  margin-bottom: 8px;
}

.uv-demo-block__title {
  font-size: 14px;
  color: #8f9ca2;
  margin-bottom: 8px;
}

.uv-demo-block__content {
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
}
</style>